<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>

<body>
  <ul id="ul"></ul>

  <script>
    let now = Date.now();  //Date.now()得到时间戳

    const total = 100000  //总共100000条数据
    const once = 20  //每次插入20条
    const page = total / once  //总页数
    let index = 1
    const ul = document.getElementById('ul')

    function loop(curTotal, curIndex) {
      if (curTotal <= 0) {      //判断总数居条数是否小于等于0
        return false
      }
      let pageCount = Math.min(curTotal, once)  //以便除不尽有余数
      setTimeout(() => {
        for (let i = 0; i < pageCount; i++) {
          let li = document.createElement('li')
          li.innerHTML = curIndex + i + ':' + ~~(Math.random() * total) 
          ul.appendChild(li)
        }
        loop(curTotal - pageCount, curIndex + pageCount)
      }, 0)
    //   loop(curTotal - pageCount, curIndex + pageCount)

    }
    loop(total, index)
  </script>
</body>

</html>